import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
          colorScheme: const ColorScheme(
              primary: Colors.black,
              surfaceVariant: Colors.white,
              secondary: Colors.green,
              background: Colors.white, //整个页面背景色
              error: Colors.red,
              brightness: Brightness.light,
              onBackground: Colors.white,
              outlineVariant: Colors.white,
              onError: Colors.yellow,
              onPrimary: Colors.white,
              onSecondary: Colors.white,
              onSurface: Color.fromARGB(255, 233, 233, 240),
              surface: Color.fromARGB(255, 17, 0, 255)) //整个标题栏颜色
          // primarySwatch: Colors.blue, // 设置主色调,无效，怎么设都是白色
          ),
      home: Scaffold(
        appBar: AppBar(title: const Text("图标"), centerTitle: true),
        body: const MyHomePage(),
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return SizedBox(
        height: 140,
        child: ListView(
          scrollDirection: Axis.horizontal, //水平列表

          padding: const EdgeInsets.all(10),
          children: <Widget>[
            Container(
              //垂直列表里面直接加Container，宽度是自适应的，设置也没用， 水平列表反过来
              width: 120,
              decoration:
                  const BoxDecoration(color: Color.fromARGB(255, 54, 98, 244)),
              child: Column(
                children: [
                  SizedBox(
                    height: 100,
                    width: 100,
                    child: Image.network(
                        "https://www.itying.com/images/flutter/3.png",
                        fit: BoxFit.fitWidth),
                  ),
                  const Text(
                    "描述",
                    textAlign: TextAlign.center,
                  )
                ],
              ),
            ),
            Container(
              height: 120,
              width: 120,
              decoration: const BoxDecoration(color: Colors.purple),
            ),
            Container(
              width: 120,
              height: 120,
              decoration: const BoxDecoration(color: Colors.yellow),
            ),
            Container(
              height: 120,
              decoration: const BoxDecoration(color: Colors.lightBlue),
            ),
            Container(
              height: 120,
              width: 120,
              decoration: const BoxDecoration(color: Colors.green),
            ),
            Container(
              height: 120,
              width: 120,
              decoration: const BoxDecoration(color: Colors.redAccent),
            ),
            Container(
              height: 120,
              width: 120,
              decoration: const BoxDecoration(color: Colors.blueGrey),
            ),
          ],
        ));
  }
}
